// mixins函数定义部分

@mixin flex($direction, $align: unset, $justify: unset) {
    display: flex;

    @if $direction == row {
        flex-direction: row;
    } @else {
        flex-direction: column;
    }
    @if $align != unset {
        align-items: $align;
    }
    @if $justify != unset {
        justify-content: $justify;
    }
}

// 动画
@mixin fadeIn($duration: 0.8s) {
    @keyframes fadeIn {
        from {
            opacity: 0;
        }
        to {
            opacity: 1;
        }
    }
    animation: fadeIn $duration;
}

@mixin fadeOut($duration: 0.8s) {
    @keyframes fadeOut {
        from {
            opacity: 1;
        }
        to {
            opacity: 0;
        }
    }
    animation: fadeOut $duration;
}
